@mixin bg-image($url) {
    background: url($url + ".png") no-repeat;
    background-size: 100%;
    @media (-webkit-min-device-pixel-ratio: 2),(min-device-pixel-ratio: 2) {
        background: url($url + "-2x.png") no-repeat;
        background-size: 100%;
    }
    
    @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3) {
        background: url($url + "-3x.png") no-repeat;
        background-size: 100%;
    }
}

// 跟随换肤
@mixin bg-theme-image($url) {
    @each $theme-name, $theme-map in $themes {
        .theme-#{"" + $theme-name} & {
            background: url($url + '-' + $theme-name +".png") no-repeat;
            background-size: 100%;
            @media (-webkit-min-device-pixel-ratio: 2),(min-device-pixel-ratio: 2) {
                background: url($url +  '-' + $theme-name + "-2x.png") no-repeat;
                background-size: 100%;
            }
            
            @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3) {
                background: url($url +  '-' + $theme-name + "-3x.png") no-repeat;
                background-size: 100%;
            }
        }
    }
    
}